<nz-card [nzBordered]="false">
  <nz-card size="large" nzBordered="false">
    <nz-divider nzOrientation="left" nzText="授权人像"></nz-divider>
    <nz-row>
      <nz-col nzSpan="6">
        <div class="box-wrap">
          <img [src]="imgArray[0]" alt="">
          <div class="title">授权身份证头像</div>
        </div>
      </nz-col>
      <nz-col nzSpan="3">
        <div class="box-wrap d-flex justify-content-center align-items-center" style="border: none">
          <div class="similarity" [class.red]="90<50">
            相似度<br/>
            90%
          </div>
        </div>
      </nz-col>
      <nz-col nzSpan="6">
        <div class="box-wrap">
          <img [src]="imgArray[1]" alt="">
          <div class="title">授权办卡时照片</div>
        </div>
      </nz-col>
      <nz-col nzSpan="3">
        <div class=" box-wrap d-flex justify-content-center align-items-center" style="border: none">
          <div class="similarity" [class.red]="10<50">
            相似度<br/>
            10%
          </div>
        </div>
      </nz-col>
      <nz-col nzSpan="6">
        <div class="box-wrap">
          <div class="img-box">
            <ng-container *ngFor="let item of imgArray;let index = index;">
              <img [class.active]="activeIndex===index" [src]="item" alt="" (mouseenter)="stop()" (mouseleave)="autoPlay()">
            </ng-container>
            <div class="btn-bar">
              <span [class.active]="activeIndex===index" *ngFor="let item of imgArray; let index = index" (click)="imgPlay(index)"></span>
            </div>
          </div>
        </div>
      </nz-col>
    </nz-row>
  </nz-card>

  <nz-card size="large" nzBordered="false">
    <nz-divider nzOrientation="left" nzText="视频"></nz-divider>
    <div sg-container="3">
      <sg>
        <nz-empty nzNotFoundContent="暂无视频"></nz-empty>
      </sg>
      <sg>
        <nz-empty nzNotFoundContent="暂无视频"></nz-empty>
      </sg>
      <sg>
        <nz-empty nzNotFoundContent="暂无视频"></nz-empty>
      </sg>
    </div>
  </nz-card>
  <nz-card size="large" nzBordered="false">
    <nz-row [nzGutter]="24">
      <nz-col nzSpan="16">
        <nz-divider nzText="人员信息" nzOrientation="left"></nz-divider>

        <sv-container col="2" [size]="'large'" [labelWidth]="150">
          <ng-container *ngFor="let val of itemArray">
            <sv *ngIf="!val.items" [label]="val.title" type="primary" >{{data[val.index]}}</sv>
            <sv *ngIf="val.items" [label]="val.title" type="primary" >{{val.items[data[val.index]]}}</sv>
          </ng-container>
        </sv-container>
      </nz-col>
      <nz-col nzSpan="8">
        <nz-divider nzText="门卡信息" nzOrientation="left"></nz-divider>
        <sv-container col="1" [size]="'large'" [labelWidth]="150">
          <ng-container *ngFor="let val of doorCardInfo">
            <sv *ngIf="!val.items" [label]="val.title" type="primary" >{{doorCard[val.index]}}</sv>
            <sv *ngIf="val.items" [label]="val.title" type="primary" >{{ val.items[doorCard[val.index]]}}</sv>
          </ng-container>
        </sv-container>

      </nz-col>
    </nz-row>
  </nz-card>
  <nz-card size="large" nzBordered="false">
    <nz-divider nzText="管理员信息" nzOrientation="left"></nz-divider>
    <app-table-page [config]="config"></app-table-page>
  </nz-card>
</nz-card>

